Blog

  • 30 Ağu 2007

Visual Studio Orcas - ASP.NET Yenilikleri [Listview ve DataPager Kontrolleri]

Merhaba arkadaşlar, bu makalemizde orcas beta 2 ile birlikte gelen olan Listview ve DataPager kontrollerine ve bize kazandırdıklarına bakacağız.

Listview

Listview kontrolü template'lere baglı olarak çalısan yeni bir listeleme kontrolüdür. Bu kontrol kendi html çıktısını üretmez. Bunun yerine Datalist nesnesine benzeyen templateleri kullanarak datayı listelememizi saglar. Bu templateler sunlardır,

n        LayoutTemplate

n        ItemTemplate

n        AlternatingItemTemplate

n        SelectedItemTemplate

n        EditItemTemplate

n        InsertItemTemplate

n        EmptyItemTemplate

n        EmptyDataTemplate

n        ItemSeparatorTemplate

n        GroupTemplate

n        GroupSeparatorTemplate

Datayı listelemek için en çok kullanılan 2 template'i vardır.   LayoutTemplate ve ItemTemplate. Layout template datanın dısarıda tanımlanmasını saglayabilir. Item template ise datanın liste içerisinde tanımlanmasını saglar. 

Layout templete içerisinde dinamik itemtemplateler kullanmak için ItemContainer'lar tanımlayabiliriz.

Örnek           

     <asp:ListView ID="ListView1" runat="server" DataSourceID="SqlDataSource1"

            EnableTheming="False">

            <ItemTemplate>

                <div>

--Databaseden gelecek Datalar,

                </div>

            </ItemTemplate>

            <LayoutTemplate> 

                                   --Dısarıdan yada dinamik olarak listeleyecegimiz kayıtlar

                </LayoutTemplate> 

                            </asp:ListView>

 

DataPager

Datapager kontorlü orcas ile gelen yeni bir asp.net kontrlüdür. Listview kontrolü üzerinde sayfalama yapmamızı saglar. Sayfalama yapacagımız kontrolü belirlemek için; PagedControlID ve sayfada kaç kayıt listelenecegini belirlemek içinde PageSize özellikleri kullanılır. Bu kontrol ile çok kolay bir biçinde sayfalama islemlerini yapabiliriz.

Örnek

    <asp:DataPager ID="DataPager1" runat="server" PagedControlID="ListView1" PageSize="5">

n        Sayfalanacak olan Listview kontrolü

n        Her sayfada 5 kayıt listelenecek

             <Fields>

                <asp:NextPreviousPagerField ButtonType="Link" ShowFirstPageButton="True" ShowNextPageButton="False"

                    ShowPreviousPageButton="False" />

n        IleriGeri butonu, ilk kayda gitmek için kullanılır, button, link ve image olabilir

                <asp:NumericPagerField />

n        Numeric sayfalamanın yapılmasını saglar.

                <asp:NextPreviousPagerField ButtonType="Link" ShowLastPageButton="True" ShowNextPageButton="False"

                    ShowPreviousPageButton="False" />

n        IleriGeri butonu, son kayda gitmek için kullanılır, button, link ve image olabilir

            </Fields>

        </asp:DataPager>

 

Konu ile ilgili örnek bir uygulama yapalım; Ilk olarak Visual Studio 2008 açalım ve yeni bir web projesi olusturalım;

 

Daha sonra sayfamıza SQLDataSource, listview ve Datapager kontrolü ekleyelim; SQLDataSource nesnesini kullanarak verileri listeleyecegiz.

 

Yukarıdaki gibi bir görüntü elde edeceksiniz;  Simdi verilerin getirilmesini saglayalım.

   <asp:SqlDataSource ID="SqlDataSource1" runat="server"

            ConnectionString="<%$ ConnectionStrings:ConnectionString %>"

            SelectCommand="SELECT [CategoryID], [Name], [Description] FROM [ArticleCategories]">

        </asp:SqlDataSource>

Verileri çektik simdi de Listview içerisinde verilerin bind edilebilmesi için listview nesnesini tempatelerini ayarlıyalım; Listemizde sadece Kategori adı ve Description listelenecek.

<asp:ListViewID="ListView1" runat="server"

            EnableTheming="False">

            <ItemTemplate>

                <div>

                    <h2>

                        <%# Eval("Name") %></h2>

                    <ul>

                        <li>

                            <%# Eval("Description") %></li>

                    </ul>

                </div>

            </ItemTemplate>

            <LayoutTemplate> 

       <li>         <asp:PlaceHolder ID="itemContainer" runat="server"></asp:PlaceHolder></li>

                </LayoutTemplate> 

                </asp:ListView>

Son olarak da listview kontrolümüzün sayfalamasını halledelim;

    <asp:DataPager ID="DataPager1" runat="server" PagedControlID="ListView1" PageSize="3">

            <Fields>

                <asp:NextPreviousPagerField ButtonType="Link" ShowFirstPageButton="True" ShowNextPageButton="False"

                    ShowPreviousPageButton="False" />

                <asp:NumericPagerField />

                <asp:NextPreviousPagerField ButtonType="Link" ShowLastPageButton="True" ShowNextPageButton="False"

                    ShowPreviousPageButton="False" />

            </Fields>

        </asp:DataPager>

Evet artık uygulamamızı çalıstırabiliriz;

 

Güzel bir sekilde listelemeyi yaptı, simdi 2. sayfaya geçelim J



Vay be, eskiden ne çok ugrastırırdı bizi simdi çok kolay JBüyüksün Microsoft diyor ve baska bir makale de görüsmek üzere sizlere iyi günler diliyorum J

Örnek kodlar için mail adresimi kullanabilirsiniz

Sem GÖKSU
info@semgoksu.com

MCP (Microsoft Certified Professional)
MCAD (Microsoft Certified Application Developer)
MCTS (Microsoft Certified Technology Specialist)

Kaynaklar

MSDN

Yorum (3)

  • hasan Tahsin / 21.4.2009 02:52:27

    yukarıda ki uygulamayı gerçekleştirdiğimde enableeventvalidation hatası alıyorum yardımınızı bekliyorum false edip denedim aynı sorun devam ediyor.

  • baba zula / 18.6.2009 11:55:48

    elinize sağlık ama sayfadaki fotoğraflar görüntülenmiyor. bu durumu da düzeltirseniz çok şık olacak. iyi çalışmalar.

  • tolga eke / 4.11.2013 12:47:40

    aynı şekilde yaptığımda datapager da şunu yaşıyorum 2. sayfaya geçmek için 2'ye iki kere tıklamak zorunda kalıyorum neden acaba ?

Yorum Yaz